<template>
	<view style="display: flex;flex-direction: column;">
		<view style="display: flex; flex-direction: column;align-items: center;justify-content: center;flex: 1;">
			<image :src="avatar" mode="" style="width: 69px;height: 69px;"></image>
			<view style="margin-top: 10px">
				<text style="color: #101010;font-size: 14px;">{{this.nick}}</text>
			</view>
			<view @click="jumpToDetail" style="margin-top: 5px;width: 80px;height: 24px;line-height: 24px;border-radius: 4px;color: rgba(247, 4, 4, 100);font-size: 14px;text-align: center;border: 1px solid rgba(247, 4, 4, 100);">
				详情信息 >
			</view>
			<view style="height: 0.5px;background-color: #E1E1E1;width: 100%;margin-top: 23px;"></view>
		</view>
		<view>
			<view @click="jumpToTaskDetail(item)" v-for="(item,index) in this.data" :key="index" style="padding: 0px 10px;margin-top: 15px;position: relative;">
				<view style="z-index: 1000;position: absolute;right: 34px;top: 0px;padding-left: 4px;padding-right: 4px;height: 20px;line-height: 20px;border-radius: 0px 0px 4px 4px;background-color: rgba(255, 152, 0, 100);color: rgba(255, 255, 255, 100);font-size: 10px;text-align: center;" :style="{backgroundColor:(item.status != '已结束')?'#FF9800':'#E5E5E5'}">{{item.status}}</view>
				<view style="margin-left: 10px;margin-right: 10px;display: flex;flex-direction: column;padding: 28px 15px 15px 15px;background-color: white;border-radius: 10px;box-shadow: 1px 1px 10px 0px rgba(220, 220, 220, 110);">
					<text style="font-size: 14px;font-weight: 500;color: #000;">{{item.title}}</text>
					<view style="display: flex;margin-top: 12px;">
						<text style="font-size: 12px;color: #E61717;font-weight: 500;">￥{{item.bounty}}</text>
						<text style="font-size: 12px;color: #000000;margin-left: 10px;">{{item.view_count}}人浏览/{{item.delivery_count}}人投稿</text>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		getServiceTaskList
	} from "@/apis/user"
	export default {

		data() {
			return {
				uid:'',
				nick:',',
				data:[],
				avatar: require("@/static/images/default.png")
			}
		},
		onLoad(option) {
			this.avatar = option.avatar || require("@/static/images/default.png");
			this.uid = option.uid;
			this.nick = option.nick;
		},
		mounted() {
			getServiceTaskList({
				service_uid: this.uid
			}).then(resp => {
				this.data = resp.data;
				console.log(resp);
			});
		},
		methods:{
			jumpToDetail(){
				uni.navigateTo({
					url:`/user/info/userInfoDetail?uid=${this.uid}`
				})
			},
			jumpToTaskDetail(task){
				uni.navigateTo({
					url:`/task/detail?id=${task.id}`
				})
			}
		}
	}
</script>

<style>
</style>
